import {Component} from 'react'
class App extends Component{
    state = {
        count:0,
        msg:'atguigu'
    }
   
    render(){
        let {count, msg} = this.state;
        return <div>
            <h3>App</h3>
            <p>App state count: {count}</p>
            <p>App state msg : {msg}</p>
            <p><button onClick={()=>{
                console.log(111);
                // 1. setState是异步的
                // 2. count只能取到初始值
                // this.setState({
                //     count: count + 1
                // })
                // this.setState({
                //     count: count + 1
                // })
                // this.setState({
                //     count: count + 1
                // })

                // 用法二： 参数是一个回调函数
                this.setState((state)=>{ // state可以获取到最新变化后的值
                    console.log('setState', state);
                    return {
                        count: state.count + 1
                    }
                })
                this.setState((state)=>{ // state可以获取到最新变化后的值
                    console.log('setState', state);
                    return {
                        count: state.count + 1
                    }
                })
                this.setState((state)=>{ // state可以获取到最新变化后的值
                    console.log('setState', state);
                    return {
                        count: state.count + 1
                    }
                })
                console.log(222);
            }}>count++</button></p>
        </div>
    }
}
export default App;